<template>
  <section>
    <el-select v-model="row.val" filterable remote reserve-keyword placeholder="请输入问卷关键词" :remote-method="remoteMethod" size="mini">
      <el-option v-for="qa in qaList" :key="qa.code" :label="qa.title" :value="qa.id">
      </el-option>
      <el-pagination v-show="totalPage>0" small layout="prev, pager, next" :page-count="totalPage" @current-change="goPage"/>
    </el-select>
  </section>
</template>

<script>
  import {mapGetters, mapActions, mapMutations} from 'vuex'
  import Vue from 'vue'//后续添加属性，需要vue联动
  import errHandler from '@/assets/errHandler'
  export default {
    name: "qa",
    props: ['row','activity'],
    data(){
      return{
        qaList:null,
        totalPage:0,
        searchKey:null
      }
    },
    created(){
      if(this.row.val) this.getQuestionnaire(this.row.val)
    },
    methods: {
      ...mapActions({
        fetch: 'fetch'
      }),
      getQuestionnaire(id){
        this.fetch({name:"getQuestionnaire",data:{id}})
          .then(res=>{
            this.qaList=[res]
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      },
      remoteMethod(key){
        this.searchKey=key
        this.getQuestionnaireList(0,this.searchKey)
      },
      goPage(val){
        this.getQuestionnaireList(val-1,this.searchKey)
      },
      getQuestionnaireList(pageNo,key){
        this.fetch({name:"getQuestionnaireList",data:{page:pageNo?pageNo:0,key}})
          .then(res=>{
            this.qaList=res.content
            this.totalPage=res.totalPages
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      }
    }
  }
</script>

<style scoped>

</style>
